@import "../../../../../common/_utils/style/mixins/mixins.scss";
@import "../../../../../common/_utils/style/common/var.scss";

@include b(zoom) {
  // width: 38px; /*因为slider的总宽度为38px,无法重置居中，所以父元素设为38px*/
  @include e(buttons) {
    width: 30px;
    margin: 0 auto;
    border-radius: $--border-radius-base;
    box-shadow: $--box-shadow-base;
    // background: $--fill-base;
    overflow: hidden;
    display: flex;
    flex-direction: column;
  }
  @include e(button) {
    height: 30px;
    padding: 0;
    border-radius: $--border-radius-base;
    margin-left: 0 !important;
    &:hover {
      border-color: #d9d9d9;
      color: rgba(0, 0, 0, 0.65);
    }
    &:focus {
      border-color: #d9d9d9;
      color: rgba(0, 0, 0, 0.65);
    }
    @include m(zoomin){
      border-bottom-right-radius: 0 !important;
      border-bottom-left-radius: 0 !important;
    }
    @include m(zoomout){
      border-radius: 0 !important;
    }
  }
  @include e(show-zoom) {
    height: 20px;
    line-height: 20px;
    text-align: center;
    border-bottom-right-radius: $--border-radius-base;
    border-bottom-left-radius: $--border-radius-base;
    border: 1px solid #d9d9d9;
    border-top: none;
  }
  @include e(slider) {
    height: 300px;
    margin-top: 20px;
    .ant-slider {
      &.ant-slider-vertical {
        margin: 6px auto;
      }
      .ant-slider-step,
      .ant-slider-track {
        width: 6px;
      }
      .ant-slider-handle {
        margin-left: -4px;
      }
    }
  }
}
